<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
  .box{
    height: 100px;
    width: 100px;
    background-color: red;
  }
</style>
<!-- <script src="./jquery.js"></script> -->
<body>
    <div class="box"></div>
</body>
</html>
<script>
  // 函数可以分为匿名函数和具名函数。

  // fn 我们称为变量  
  // function () {} 我们称为匿名函数
  // 匿名函数没有提升。
//   let fn = function () {
//      console.log('dede');
//   }
//   fn();

// 具名函数 fn 我们称为具名函数
// 具名函数有提升，可以在任何地方调用。
// fn();
// function fn () {
//   console.log('我是具名函数');
// }


// 当函数没有返回值的时候，调用函数得到的是一个undefind

// function fn (){
//   let i = 100;
//   return i;
// }
// console.log(fn());


// 什么是回调函数；
// 当一个函数，作为参数，被传入到另外一个函数中，并且调用该函数。我们称该函数为回调函数

// function fn (cb) {
//    cb(10)
// }
// function fn1 (val) { // 我们称为回调函数。
//   console.log(val);
// }
// fn(fn1);

// $('.box').click(function(){ // 他就是回调函数
//     console.log('我是回调函数');
// })

$('.box').click(function(){ // 回调函数
  console.log('cvbn');
});

// let obj = {
//   name: '李四'
// }
// console.log(obj.name);

// console.log($('.box').click(123));
function $ (val){
  let dom = document.querySelector(val);
  return {
    click: function(cb){
      dom.onclick = cb;
    }
  }
}


// function $ (val){
//   let dom = document.querySelector(val);
//   return {
//     click: function (cb) {
//       dom.onclick = cb;
//     }
//   }
// }


// let arr = [];
// arr.forEach(item => { // 回调函数

// })
</script>